<template>
	<view class="login">
		<view class="title">GoEasy IM</view>
		<input type="text" class="input-box" v-model="username" placeholder="请输入账号">
		<input type="password" class="input-box" v-model="password" placeholder="请输入密码">
		<button class="login-btn" @click="login">登录</button>
	</view>
</template>

<script>
	export default {
	        name: "Login",
	        data () {
	            return {
	                username : 'Mattie',
	                password : '123'
	            }
	        },
	        methods : {
	        login () {
						const user = {
							data: {
								'uuid': "08c0a6ec-a42b-47b2-bb1e-15e0f5f9a19a",
								'avatar': "/static/images/Avatar-1.png", 
								'name': "Mattie"
							},
							'avatar': "/static/images/Avatar-1.png",
							'name': "Mattie",
							'uuid': "08c0a6ec-a42b-47b2-bb1e-15e0f5f9a19a",
							'type': "object"
						}
						if (this.username.trim() !== "" && this.password.trim() !== "") {
							// 模拟请求接口回来的数据
							if(user){
								uni.setStorageSync('currentUser', user);
								uni.redirectTo({
									url: '../index/index'
								});
								return
							}
						}
				}
	        }
	    }
</script>

<style>
	.login{
		padding-top: 160rpx;
		width:100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.title {
		height: 100rpx;
		font-size:84rpx;
		text-align: center;
		font-family: Source Han Sans CN;
		font-style: normal;
		font-weight: bold;
		color: #D02129;
		margin-bottom: 80rpx;
	}
	.input-box {
		width:600rpx;
		height: 50rpx;
		margin-bottom: 40rpx;
		padding: 26rpx;
		font-size: 32rpx;
	}
	input{
		border: 1px solid #E0E0E0;
	}
	input::-webkit-input-placeholder{
		color: #999999;
	}
	input::-moz-placeholder{
		color: #999999;
	}
	input::-ms-input-placeholder{
		color: #999999;
	}
	.login-btn{
		width: 680rpx;
		height: 100rpx;
		line-height: 100rpx;
		font-size:36rpx ;
		text-align: center;
		color: #ffffff;
		background: #618DFF;
		outline: none;
		border: 0;
	}
</style>
